


import 'dart:ui';

import 'package:alip_app/AppStates/UserState.dart';
import 'package:alip_app/StateManagement/ModelProvider.dart';
import 'package:alip_app/UI/Pages/AboutUsPage.dart';
import 'package:alip_app/UI/Pages/MainPage.dart';
import 'package:alip_app/UI/Pages/SignInPage.dart';
import 'package:flare_flutter/flare_actor.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class UserCenterPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _UserCenterPageState();

}
class _UserCenterPageState extends State<UserCenterPage> {
  @override
  Widget build(BuildContext context) {
    Widget buildingWidget;
    buildingWidget = _buildContent();
    final backButton = FloatingActionButton(onPressed: (){
      ModelContainer.of<MainPageModel>(context).model.switchPage(1);
    }, child: Icon(Icons.arrow_back, color: Colors.blue, size: 32.0,), backgroundColor: Colors.white);
    buildingWidget = Column(
      children: [
        Expanded(child: buildingWidget),
        Row(
          children: [
            backButton,
            Spacer(),
          ],
        ),
      ],
    );
    buildingWidget = Stack(
      children: [
        Positioned.fill(
          child: _buildingBackground()
        ),
        Positioned.fill(child: buildingWidget, top: 10.0, bottom: 10.0, right: 10.0, left: 10.0,)
      ],
    );
    buildingWidget = IconTheme(
      child: buildingWidget,
      data: IconThemeData(color: Theme.of(context).primaryColor),
    );
    return buildingWidget;
  }
  Widget _buildingBackground() {
    return FlareActor("assets/animations/UserCenter.flr", animation: "active", fit: BoxFit.cover,);
  }
  Widget _buildContent(){
    final contentTextStyle = TextStyle(color: Colors.white, fontFamily: "ukij-cjk");
    Widget buildingWidget = ListView(
      children: [
        SizedBox(height: 20.0,),
        ModelDescendant<UserState>(
          onChanged: (context, child, data) => Center(
            child: CircleAvatar(
              child: data.hasSignIn ? SizedBox() : Icon(CupertinoIcons.person_solid, size: 80.0, color: Colors.white,),
              backgroundColor: Colors.white.withOpacity(0.2),
              radius: 50.0,
              backgroundImage: data.hasSignIn ? NetworkImage(data.userInfo.avatar) : null,
            ),
          ),
        ),
        ModelDescendant<UserState>(
          onChanged: (context, child, data) {
            return Column(
              children: [
                SizedBox(height: 10.0,),
                Text("خۇش كېلىپسىز ${data.userInfo?.userName ?? ""}", style: TextStyle(fontSize: 18.0, color: Colors.white),),
                SizedBox(height: 10.0,),
                FlatButton(
                  color: Colors.white,
                  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
                  child: Text(data.hasSignIn ? "چىكىنىش" : "كىرىڭ"),
                  onPressed: (){
                    if (data.hasSignIn) {
                      data.userInfo = null;
                      data.applyChanges();
                      return;
                    }
                    Navigator.of(context).push(MaterialPageRoute(builder: (context) => SignInPage(),));
                  },
                ),
//                Row(children: [
//                  Text("ھىساباتىڭىز يوقمۇ؟"),
//                  SizedBox(width: 10.0,),
//                  Text("بۇ يەردىن تىزىملىتىڭ!", style: TextStyle(decorationStyle: TextDecorationStyle.dotted),)
//                ], mainAxisAlignment: MainAxisAlignment.center,)
              ],
            );
          },
        ),
        SizedBox(height: 60.0,),
        Center(
          child: Container(
            constraints: BoxConstraints(
              maxWidth: 350.0,
            ),
            child: ClipRRect(
              borderRadius: BorderRadius.circular(15.0),
              child: BackdropFilter(
                filter: ImageFilter.blur(sigmaY: 10.0, sigmaX: 10.0),
                child: Container(
                  decoration: BoxDecoration(
                    color: Colors.white.withOpacity(0.2),
                  ),
                  child: Column(
                    children: [
                      ListTile(
                        title: Text("يازمىلىرىم", style: contentTextStyle.copyWith(fontWeight: FontWeight.bold, fontSize: 18.0),),
                        subtitle: Text("يازمىلىرىڭىزنى بۇ يەردىن كۆرۈڭ", style: contentTextStyle,),
                        leading: CircleAvatar(
                          radius: 25.0,
                          backgroundColor: Colors.white,
                          child: Icon(CupertinoIcons.create, size: 30.0,),
                        ),
                        trailing: Icon(Icons.arrow_forward_ios, color: Colors.white,),
                      ),
                      Divider(),
                      ListTile(
                        title: Text("ئىنكاسلىرىم", style: contentTextStyle.copyWith(fontWeight: FontWeight.bold, fontSize: 18.0),),
                        subtitle: Text("سىز يازغان ئىنكاسلارنى بۇ يەردىن كۆرۈڭ", style: contentTextStyle,),
                        leading: CircleAvatar(
                          radius: 25.0,
                          backgroundColor: Colors.white,
                          child: Icon(CupertinoIcons.create, size: 30.0,),
                        ),
                        trailing: Icon(Icons.arrow_forward_ios, color: Colors.white,),
                      ),
                      Divider(),
                      ListTile(
                        title: Text("ھەققىدە", style: contentTextStyle.copyWith(fontWeight: FontWeight.bold, fontSize: 18.0),),
                        subtitle: Text("بىز كىم؟ ئالاقىلىشىڭ", style: contentTextStyle,),
                        leading: CircleAvatar(
                          radius: 25.0,
                          backgroundColor: Colors.white,
                          child: Icon(CupertinoIcons.info, size: 30.0,),
                        ),
                        trailing: Icon(Icons.arrow_forward_ios, color: Colors.white,),
                        onTap: (){
                          Navigator.of(context).push(MaterialPageRoute(builder: (context) => AboutUsPage(),));
                        },
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ),
        )
      ],
    );

    buildingWidget = DefaultTextStyle(
      child: buildingWidget,
      style: contentTextStyle
    );
    return buildingWidget;
  }
}
